<template>
  <div class="text-center mt-5">
    <h1>倒计时计时器</h1>
    <p>剩余时间：{{ timeLeft }} 秒</p>
    <button @click="startCountdown" class="btn btn-primary">开始倒计时</button>
  </div>
</template>

<script setup>
import { ref } from 'vue';

const timeLeft = ref(10); // 初始时间为 10 秒

function startCountdown() {
  const interval = setInterval(() => {
    if (timeLeft.value > 0) {
      timeLeft.value--;
    } else {
      clearInterval(interval);
    }
  }, 1000);
}
</script>